<template>
  <a-layout-sider v-model:collapsed="sidebarCollapsed" class="app-sider">
    <div class="app-logo">
      <img :src="logo" class="app-logo-img" alt="老虎管理">
      <h1>老虎管理</h1>
    </div>
    <Menu />
  </a-layout-sider>
</template>

<script lang="ts">
import { defineComponent, computed, } from 'vue'
import { useStore } from 'vuex'
import Menu from './Menu/index.vue'
import logo from '/@/assets/images/logo.png'

export default defineComponent({
  components: {
    Menu
  },
  setup() {
    const store = useStore()
    const sidebarCollapsed = computed(() => store.state.app.sidebarCollapsed)

    return {
      sidebarCollapsed,
      logo,
    }
  }
})
</script>
